<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort() + path + "/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<meta charset="UTF-8">
		<title>呼送后台管理系统-首页</title>
		<link rel="stylesheet" type="text/css" href='<c:url value="/Js/jquery-easyui-1.3.2/themes/default/easyui.css"/>'>
		<link rel="stylesheet" type="text/css" href='<c:url value="/Js/jquery-easyui-1.3.2/themes/icon.css"/>'>
		<link rel="stylesheet" type="text/css" href='<c:url value="/Js/jquery-easyui-1.3.2/demo/demo.css"/>'>
		<script type="text/javascript" src='<c:url value="/Js/jquery-easyui-1.3.2/jquery-1.8.0.min.js"/>'></script>
		<script type="text/javascript" src='<c:url value="/Js/jquery-easyui-1.3.2/jquery.easyui.min.js"/>'></script>
		
		<link rel="stylesheet" href='<c:url value="/Js/JQuery-zTree-v3.5.12/css/demo.css"/>' type="text/css">
		<link rel="stylesheet" href='<c:url value="/Js/JQuery-zTree-v3.5.12/css/zTreeStyle/zTreeStyle.css"/>' type="text/css">
		<!-- <script type="text/javascript" src='<c:url value="/Js/JQuery-zTree-v3.5.12/js/jquery-1.4.4.min.js"/>'></script> -->
		<script type="text/javascript" src='<c:url value="/Js/JQuery-zTree-v3.5.12/js/jquery.ztree.core-3.5.js"/>'></script>
		
		<script type="text/javascript">
		
			
			
			var setting = {	};
			
			var zNodes = "";
	
			$(document).ready(function(){
				// 使用Ajax加载
				$.post('<%=basePath%>tree/tree/list',{},function(data){
					zNodes = jQuery.parseJSON(data);
					// 加载zTree
					$.fn.zTree.init($("#zTree"), setting, zNodes);
				});
				
				//监听右键事件，创建右键菜单
	            $('#tabs').tabs({
	                onContextMenu:function(e, title,index){
	                    e.preventDefault();
	                    if(index>0){
	                        $('#ment').menu('show', {
	                            left: e.pageX,
	                            top: e.pageY
	                        }).data("tabTitle", title);
	                    }
	                }
	            });
	            
	            // 右键事件
	            function tabClick(menu, type){
	            	// 获取当前的面板
	            	var curTabTitle = $(menu).data("tabTitle");
	            	switch (type) {
		            	case "1"://关闭当前
		                    $("#tabs").tabs("close", curTabTitle);
		                    return false;
		                    break;
		                case "2"://关闭当前
		                    var panel = $("#tabs").tabs("getTab", curTabTitle).panel("refresh");
                    		break;
		           	}
			            	
	            }
	            
	            //右键菜单click
	            $("#ment").menu({
	                onClick : function (item) {
	                    tabClick(this, item.name);
	                }
	            });
				
			});
			
			// 点击书的事件
			function load_tree(url,text){
				if(url==null || url=='' || url=='null'){
					return;
				}
				if($("#tabs").tabs('exists',text)){ 
					$('#tabs').tabs('select',text); 
					//$('#tabs').tabs('update');
				} else{ 
					$('#tabs').tabs('add',{ 
						title: text, 
						closable: true, 
						content: "<iframe name='mainFrame'  src='<%=basePath%>manager/"+url+"' scrolling='auto' frameborder='0' width='100%' height='95%' ></iframe>" 
					}); 
				} 
			}
		</script>
		
	</head>
	<body class="easyui-layout">
		<div data-options="region:'north',border:false"
			style="height: 80px; background: #FFFFFF; padding: 10px">
			<!-- 显示管理员登录信息 以及 背景图片 -->
		</div>
		
		<div data-options="region:'west',split:true,title:'操作菜单'"
			style="width: 200px; padding: 10px;overflow: hidden;">
			<!--  加载菜单树 -->
			<ul id="zTree" class="ztree" style="background: white; margin-left: -5px;margin-top: -5px; width: 100%; height: 99%; border: 0px;"></ul>
		</div>
		
		<div data-options="region:'center'" >
			<div class="easyui-tabs" id="tabs">
				<div title="首页说明" style="overflow:auto;padding:10px;width: 100%;">
					<h3>呼送后台管理系统-首页</h3>
				</div>
				
			</div>
		</div>
		
		<!-- 右击显示 -->
		<div id="ment" class="easyui-menu" style="width:120px;">
	        <div id="mm-tabclose" name="1">关闭</div>
	        <div class="menu-sep"></div>
	        <div id="mm-tabrefresh" name="2">刷新</div>
	    </div>
		
	</body>
</html>
